<!-- $Id$
 *
 * Red Pitaya Lcr meter client
 *
 * Author: Luka Golinar <luka.golinar@gmail.com>
 *
 * (c) Red Pitaya  http://www.redpitaya.com
 *
-->
<!DOCTYPE html>
<html lang="en">

<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"></meta>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta http-equiv="cache-control" content="max-age=0" />
    <meta http-equiv="cache-control" content="no-cache" />
    <meta http-equiv="expires" content="0" />
    <meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
    <meta http-equiv="pragma" content="no-cache" />
    <title>Red Pitaya</title>
    <link rel="stylesheet" href="../assets/bootstrap/css/bootstrap.min.css?1" onerror="location.reload()">
    <link rel="stylesheet" href="../assets/loader.css?1" type="text/css" onerror="location.reload()">
    <link rel="stylesheet" href="../assets/lpulse.css?1" type="text/css" onerror="location.reload()">
    <link rel="stylesheet" href="../assets/usermis.css?1" type="text/css" onerror="location.reload()">
    <link rel="stylesheet" href="../assets/popupstack.css?1" type="text/css" onerror="location.reload()" />
    <link rel="stylesheet" href="../assets/help-system/help-system.css?1" type="text/css" onerror="location.reload()" />
    <link rel="stylesheet" href="css/style.css?2" onerror="location.reload()">
    <script src="../assets/jquery/jquery-2.1.3.min.js?1" onerror="location.reload()"></script>
    <script src="../assets/jquery/jquery-ui.min.js?1" onerror="location.reload()"></script>
    <script src="../assets/jquery/jquery.ui.touch-punch.min.js?1" onerror="location.reload()"></script>
    <script src="../assets/jquery/jquery.simulate.js?1" onerror="location.reload()"></script>
    <script src="../assets/jquery/jquery.cookie.js?1" onerror="location.reload()"></script>
    <script src="../assets/jquery/jquery.browser.js?1" onerror="location.reload()"></script>
    <script src="../assets/bootstrap/js/bootstrap.min.js?1" onerror="location.reload()"></script>
    <script src="../assets/browsercheck.js?1" onerror="location.reload()"></script>
    <script src="../assets/zlib_and_gzip.min.js?1" onerror="location.reload()"></script>
    <script src="../assets/pako.js?1" onerror="location.reload()"></script>
    <script src="../assets/popupstack.js?1" onerror="location.reload()"></script>
    <script src="../assets/help-system/help-system.js?1" onerror="location.reload()"></script>
    <script src="js/table2CSV.js?1" type="text/javascript" onerror="location.reload()"></script>
    <script src="js/help-lcr.js?1" onerror="location.reload()"></script>
    <script src="js/lcr.js?1" onerror="location.reload()"></script>
    <script src="js/client.js?2" onerror="location.reload()"></script>
</head>

<body class="user_lost connection_lost">
    <div id="user-wrapper">
        <div id="user"></div>
        <div id="user-desc">Device is already in use by another user.</div>
    </div>
    <div id="pulse-wrapper">
        <div id="pulse"></div>
        <div id="pulse-desc">Connection with device is lost.</div>
    </div>
    <div id="loader-wrapper">
        <div style="width: 100%;height: 60%;">
            <div id="loader" style="top:70%"></div>
        </div>
        <div id="text_message" style="display: none;">
            <p id="text_message" style="text-align: center;">
                Extension module is not connected
            </p>
        </div>
    </div>
    <div id="header">
        <div id="description">&nbsp;</div>
    </div>
    <div id="content_wrapper" class="full-content">
        <div class="container-fluid">
            <div class="navbar navbar-inverse" role="navigation">
                <div class="container">
                    <!-- Navigation bar -->
                    <div class="navbar-header">
                        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                            <span class="sr-only">T</span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>
                        <a class="navbar-brand" href="/">
                            <img class="back-btn" src="../assets/images/navigation_arrow_left.png">
                        </a>
                        <img class="logo" width=110 src="../assets/images/navigation_logo.png">
                    </div>
                    <div class="collapse navbar-collapse">
                        <ul class="nav navbar-nav">
                            <!--<li><a id="LCR_CALIBRATE" href="#" style="padding-left: 23px; white-space: nowrap;">CALIBRATE</a></li>-->
                            <li style="width: 60px">
                                <a href="https://redpitaya.readthedocs.io/en/latest/appsFeatures/applications/lcr_meter/lcr_meter.html" target="_blank" style="padding-left: 0; padding-right: 0;">
                                    <img src="../assets/images/help.png" width=20px>
                                </a>
                            </li>
                            <li class="dropdown">
                                <a class="dropdown-toggle" type="button" id="menu1" data-toggle="dropdown"  style="padding-left: 23px; white-space: nowrap;">SETTINGS<span class="caret"></span></a>
                                <ul id="settings_dropdown" class="dropdown-menu" role="menu" aria-labelledby="menu1" style="background: #cdcccc; min-width: 0px;">
                                    <li><a id="reset_settings" href="#">RESET</a></li>
                                </ul>
                            </li>
                            <li>
                                <a id="LCR_LOG" href="#" style="padding-left: 23px; white-space: nowrap;" value="0">LOG DATA</a>
                                <a id="LCR_LOG_STOP" href="#" style="padding-left: 23px; white-space: nowrap; display:none;" value="0">STOP</a>
                            </li>
                            <li>
                                <a id="LCR_HOLD" href="#" style="display:block;">HOLD</a>
                                <a id="LCR_START" href="#" style="display: none;">START</a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <div id="cont" style="display: none;">
                <!-- Data display -->
                <div id="data_window" class="data_wrapper" style="position: relative">
                    <!-- Pimary display -->
                    <div id="data_displ">
                        <div id="meas_displ">
                            <div class="meas_data" style="float: left">
                                <label class="col-xs-5" for="lb_mes_mode" style="color: #000000">P. DISP: </label>
                                <label class="col-xs-6" id="meas_p_d" for="lb_mes_mode" style="color: #000000">Z</label>
                            </div>
                            <div class="meas_data" style="float: left">
                                <label class="col-xs-5" for="lb_mes_freq" style="color: #000000">S. DISP: </label>
                                <label class="col-xs-6" id="meas_s_d" for="lb_mes_freq" style="color: #000000">P</label>
                            </div>
                            <div class="meas_data" style="float: left">
                                <label class="col-xs-5" for="lb_mes_min" style="color: #000000">MODE: </label>
                                <label class="col-xs-6" id="meas_mode_d" for="lb_mes_min" style="color: #000000">AUTO</label>
                            </div>
                            <div class="meas_data" style="float: left">
                                <label class="col-xs-5" for="lb_mes_max" style="color: #000000">FREQ.: </label>
                                <label class="col-xs-6" id="meas_freq_d" for="lb_mes_max" style="color: #000000">100Hz</label>
                            </div>
                            <div class="meas_data" style="float: left">
                                <label class="col-xs-5" for="lb_mes_avg" style="color: #000000">SHUNT: </label>
                                <label class="col-xs-6" id="lb_shunt" for="lb_mes_avg" style="color: #000000">-</label>
                            </div>
                            <div class="meas_data" style="float: left">
                                <label class="col-xs-5" for="lb_mes_avg" style="color: #000000">MIN: </label>
                                <label class="col-xs-6" id="meas_min_d" for="lb_mes_avg" style="color: #000000">-</label>
                            </div>
                            <div class="meas_data" style="float: left">
                                <label class="col-xs-5" for="lb_mes_avg" style="color: #000000">MAX: </label>
                                <label class="col-xs-6" id="meas_max_d" for="lb_mes_avg" style="color: #000000">-</label>
                            </div>
                            <div class="meas_data" style="float: left">
                                <label class="col-xs-5" for="lb_mes_avg" style="color: #000000">AVG: </label>
                                <label class="col-xs-6" id="meas_avg_d" for="lb_mes_avg" style="color: #000000">-</label>
                                <div style="padding-bottom: 5px;">
                                    <img id="CLEAR_MIN_MAX" src="img/reset2.png" style="width: 16px;">
                                </div>
                            </div>
                        </div>
                        <div id="display">
                            <div id="sec_displ">
                                <label id="lb_sec_displ" class="col-xs-8 displ_text" for="lb_sec_dspl" style="color: #000000">0</label>
                                <label id="lb_sec_displ_units" class="col-xs-4" for="lb_sec_dspl_range" style="color: #000000">--</label>
                            </div>
                            <div id="prim_displ">
                                <label id="lb_prim_displ" class="col-xs-8 displ_text" for="lb_prim_dspl" style="color: #000000">0</label>
                                <label id="lb_prim_displ_units" class="col-xs-4" for="lb_prim_dspl_range" style="color: #000000">--</label>
                            </div>
                            <div id="tol_rel_displ">
                                <div>
                                    <label id="TOL_CAPTION" style="width: 10%;font-weight: bold;">Tol:</label>
                                    <label id="TOL_VALUE"></label>
                                </div>
                                <div>
                                    <label id="REL_CAPTION" style="width: 10%;font-weight: bold;">Rel:</label>
                                    <label id="REL_VALUE"></label>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- Secondary display -->
                    <div id="menu_conent" class="menu_content">
                        <div class="menu_wrapper">
                            <div class="col-xs-12 menu_header">
                                <label for="lb_tag" style="color: #d43f3a">DATA OPTIONS</label>
                            </div>
                            <div class="separator col-xs-4">
                            </div>
                        </div>
                        <div class="menu_wrapper col-xs-4" style="width: 50%;">
                            <form class="form-horizontal" role="form">
                                <div>
                                    <div style="float:left;width: 50%">
                                        <label for="lb_pdi_primary" style="margin-bottom: 0px; margin-top:6px;float: right;">Primary Display:</label>
                                    </div>
                                    <div id="prim_displ_choice">
                                        <input style="display:none;" type="checkbox" id="LCR_R" name="LCR_R" class="bt_check" index="3" value="Ω" />
                                        <label for="LCR_R">R</label>
                                        <input style="display:none;" type="checkbox" id="LCR_C" name="LCR_C" class="bt_check" index="2" value="F" />
                                        <label for="LCR_C">C</label>
                                        <input style="display:none;" type="checkbox" id="LCR_L" name="LCR_L" class="bt_check" index="1" value="H" />
                                        <label for="LCR_L">L</label>
                                        <input style="display:none;" type="checkbox" id="LCR_Z" name="LCR_Z" class="bt_check" index="0" value="Ω" />
                                        <label for="LCR_Z">Z</label>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <div class="menu_wrapper col-xs-4" style="width: 50%;">
                            <form class="form-horizontal" role="form">
                                <div>
                                    <div style="float:left;width: 50%;">
                                        <label for="lb_pdi_primary" style="margin-bottom: 0px; margin-top:6px;float: right;">Secondary Display:</label>
                                    </div>
                                    <div id="sec_displ_choice">
                                        <input style="display:none;" type="checkbox" id="LCR_ESR" name="LCR_ESR" class="bt_check" index="3" value="Ω" />
                                        <label for="LCR_ESR">E</label>
                                        <input style="display:none;" type="checkbox" id="LCR_Q" name="LCR_Q" class="bt_check" index="2" value="" />
                                        <label for="LCR_Q">Q</label>
                                        <input style="display:none;" type="checkbox" id="LCR_D" name="LCR_D" class="bt_check" index="1" value="" />
                                        <label for="LCR_D">D</label>
                                        <input style="display:none;" type="checkbox" id="LCR_P" name="LCR_P" class="bt_check" index="0" value="deg" />
                                        <label for="LCR_P">P</label>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <div class="menu_wrapper">
                            <div class="col-xs-12 menu_header">
                                <label for="lb_tag" style="color: #d43f3a">MEASURMENT OPTIONS</label>
                            </div>
                            <div class="separator col-xs-4">
                            </div>
                        </div>
                        <div class="menu_wrapper col-xs-4" style="width: 50%;">
                            <form class="form-horizontal" role="form">
                                <div>
                                    <div style="float:left">
                                        <label for="lb_freq" style="margin-bottom: 0px; margin-top:5px;">Select Frequency: </label>
                                    </div>
                                    <div class="col-xs-7" style="float: right">
                                        <select id="LCR_FREQUENCY" class="form-control">
                                            <option value="10">10 Hz</option>
                                            <option value="100">100 Hz</option>
                                            <option value="1000">1 kHz</option>
                                            <option value="10000">10 kHz</option>
                                            <option value="100000">100 kHz</option>
                                            <option value="1000000">1 MHz</option>
                                        </select>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <div class="menu_wrapper col-xs-4" style="width: 50%;">
                            <form class="form-horizontal" role="form">
                                <div>
                                    <div style="float:left">
                                        <label for="lb_freq" style="margin-bottom: 0px; margin-top:5px;">Select Shunt: </label>
                                    </div>
                                    <div class="col-xs-7" style="float: right">
                                        <select id="LCR_SHUNT_MODE" class="form-control">
                                        <option value="-1">AUTO</option>
                                        <option value="0">10 Ohm</option>
                                        <option value="1">100 Ohm</option>
                                        <option value="2">1 kOhm</option>
                                        <option value="3">10 kOhm</option>
                                        <option value="4">100 kOhm</option>
                                        <option value="5">1 MOhm</option>
                                    </select>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <br> &nbsp;
                        <div class="menu_wrapper col-xs-4">
                            <form class="form-horizontal" role="form">
                                <div>
                                    <div id="parl_ser" style="float: right" class="col-xs-12">
                                        <input style="display:none;" type="checkbox" id="cb_ser" name="cb_ser"  index="1" class="bt_check" />
                                        <label for="cb_ser" style="width: 50%">Series</label>
                                        <input style="display:none;" type="checkbox" id="cb_paralel" name="cb_paralel" index="0" class="bt_check" />
                                        <label for="cb_paralel" style="width: 50%">Parallel</label>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <div class="menu_wrapper">
                            <div class="col-xs-12 menu_header">
                                <label for="lb_tag" style="color: #d43f3a">DISPLAY OPTIONS</label>
                            </div>
                            <div class="separator col-xs-4">
                            </div>
                        </div>
                        <div class="menu_wrapper col-xs-4" style="width: 50%;">
                            <form class="form-horizontal" role="form">
                                <div>
                                    <div style="float:left">
                                        <label for="lb_pdi_primary" style="margin-bottom: 0px; margin-top:5px;">Select Mode:</label>
                                    </div>
                                    <div id="sel_mode" style="float: right" class="col-xs-8">
                                        <input style="display:none;" type="checkbox" id="cb_manual" name="cb_manual" index="1" class="bt_check" />
                                        <label for="cb_manual" style="width: 50%">Manual</label>
                                        <input style="display:none;" type="checkbox" id="cb_auto" name="cb_auto" index="0" class="bt_check" checked="checked" />
                                        <label for="cb_auto" style="width: 50%">Auto</label>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <div class="menu_wrapper col-xs-4" style="width: 50%;">
                            <form class="form-horizontal" role="form">
                                <div>
                                    <div style="float:left">
                                        <label for="lb_range" style="margin-bottom: 0px; margin-top:5px;">Select Range: </label>
                                    </div>
                                    <div style="float: right;width: 25%;padding-right: 15px;">
                                        <select id="sel_range_u" class="form-control">
                                            <option value="0">nΩ</option>
                                            <option value="1">uΩ</option>
                                            <option value="2">mΩ</option>
                                            <option value="3">Ω</option>
                                            <option value="4">kΩ</option>
                                            <option value="5">MΩ</option>
                                        </select>
                                    </div>
                                    <div class="col-xs-5" style="float: right">
                                        <select id="sel_range_f" class="form-control">
                                            <option value="0">1.0000</option>
                                            <option value="1">10.000</option>
                                            <option value="2">100.00</option>
                                            <option value="3">1000.0</option>
                                        </select>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <br> &nbsp;
                        <div class="menu_wrapper col-xs-4">
                            <form class="form-horizontal" role="form">
                                <div>
                                    <div id="rel_tol" style="float: right" class="col-xs-12">
                                        <input style="display:none;" type="checkbox" id="cb_rel" name="cb_rel" class="bt_check radio" />
                                        <label for="cb_rel" style="width: 50%">Relative</label>
                                        <input style="display:none;" type="checkbox" id="cb_tol" name="cb_tol" class="bt_check radio" />
                                        <label for="cb_tol" style="width: 50%">Tolerance</label>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
                <!-- Main right menu -->
                <div class="global_container">
                    <div id="table_displ">
                        <table id="m_table" class="table table-bordered table-fixed">
                            <thead>
                                <tr>
                                    <th class="table_num_w">#</th>
                                    <th class="table_num_w">DATE</th>
                                    <th class="table_num_w">SHUNT</th>
                                    <th class="table_num_w">FREQ</th>
                                    <th id="table_p_header" style="width: 50%;">Z</th>
                                    <th id="table_s_header" style="width: 50%;">P</th>
                                </tr>
                            </thead>
                            <tbody>

                            </tbody>
                        </table>
                    </div>
                    <div id="table_cmd">
                        <button id="btn_export" type="button" class="btn" onclick="export_table()">Export Table</button>
                        <div class="menu_wrapper col-xs-4" style="width: 25%;margin-top: 2px; max-width: 250px;min-width: 250px;">
                            <form class="form-horizontal" role="form">
                                <div>
                                    <div style="float:left">
                                        <label for="lb_freq" style="margin-bottom: 0px; margin-top:5px;max-width: 60px;">Interval: </label>
                                    </div>
                                    <div class="col-xs-7" style="float: right;min-width: 130px;">
                                        <select id="LOG_INTERVAL" class="form-control">
                                            <option value="100">100 ms</option>
                                            <option value="500">500 ms</option>
                                            <option value="1000">1.0 s</option>
                                            <option value="1500">1.5 s</option>
                                            <option value="2000">2.0 s</option>
                                            <option value="2500">2.5 s</option>
                                            <option value="3000">3.0 s</option>
                                        </select>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <button id="btn_clear" type="button" class="btn" onclick="clearRowTable()">Clear</button>
                        <button id="btn_clear_all" type="button" class="btn" onclick="clearTableAll()">Clear All</button>
                    </div>
                </div>
                <!-- Open calib modal -->
                <div class="modal fade" id="modal_calib_start" role="dialog">
                    <div class="modal-dialog">
                        <!-- Modal content-->
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal">&times;</button>
                                <h4 class="modal-title">Starting calibration process...</h4>
                            </div>
                            <div class="modal-body" style="padding: 15px 0 15px 0px">
                                <div class="modal-body">
                                    <div class="progress">
                                        <div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="10" aria-valuemin="0" aria-valuemax="100" style="width:10%">
                                            10% Complete
                                        </div>
                                    </div>
                                    <div>
                                        <h5>Please connect open calibration circuit and press start</h5>
                                    </div>
                                </div>
                                <div class="modal-footer" style="width: 100%">
                                    <button id="bt_calib_start" type="button" class="btn btn-default" style="width: 25%">Start</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- Open calib modal -->
                <div class="modal fade" id="modal_calib_open" role="dialog">
                    <div class="modal-dialog">
                        <!-- Modal content-->
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal">&times;</button>
                                <h4 class="modal-title">Calibrating....</h4>
                            </div>
                            <div class="modal-body" style="padding: 15px 0 15px 0px">
                                <div class="modal-body">
                                    <div class="progress">
                                        <div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100" style="width:50%">
                                            50%
                                        </div>
                                    </div>
                                    <div>
                                        <h5>Please connect short calibration and press next</h5>
                                    </div>
                                </div>
                                <div class="modal-footer" style="width: 100%">
                                    <button id="bt_calib_open" type="button" class="btn btn-default" style="width: 25%">Next</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- Short calib modal -->
                <div class="modal fade" id="modal_calib_short" role="dialog">
                    <div class="modal-dialog">
                        <!-- Modal content-->
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal">&times;</button>
                                <h4 class="modal-title">Calibrating.....</h4>
                            </div>
                            <div class="modal-body" style="padding: 15px 0 15px 0px">
                                <div class="modal-body">
                                    <div class="progress">
                                        <div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100" style="width:100%">
                                            100%
                                        </div>
                                    </div>
                                    <div>
                                        <h5>You have successfully calibrated your Red Pitaya.</h5>
                                    </div>
                                </div>
                                <div class="modal-footer" style="width: 100%">
                                    <button id="bt_calib_short" type="button" class="btn btn-default" style="width: 25%" data-dismiss="modal">Finish</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- Socket not opened modal -->
                <div class="modal fade" id="modal_reload_page" role="dialog">
                    <div class="modal-dialog">
                        <!-- Modal content-->
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close">&times;</button>
                                <h4 class="modal-title">Unable to load application.</h4>
                            </div>
                            <div class="modal-body" style="padding: 15px 0 15px 0px">
                                <div class="modal-body">
                                    <div>
                                        <h5>E3: Socket not opened. Press Reload to reload the application.</h5>
                                    </div>
                                </div>
                                <div class="modal-footer" style="width: 100%">
                                    <button id="bt_app_reload" type="button" class="btn btn-primary btn-app-restart" style="width: 50%" data-dismiss="modal">Reload</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- Socket closed modal(yes, it differs) -->
                <div class="modal fade" id="modal_socket_closed" role="dialog">
                    <div class="modal-dialog">
                        <!-- Modal content-->
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close">&times;</button>
                                <h4 class="modal-title">Time-out.</h4>
                            </div>
                            <div class="modal-body" style="padding: 15px 0 15px 0px">
                                <div class="modal-body">
                                    <div>
                                        <h5>Socket closed. Press reload to reload the application.</h5>
                                    </div>
                                </div>
                                <div class="modal-footer" style="width: 100%">
                                    <button id="bt_app_reload" type="button" class="btn btn-primary btn-app-restart" style="width: 50%" data-dismiss="modal">Reload</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- Extension module disconnected Modal -->
                <div class="modal fade" id="modal_module_disconnected" role="dialog">
                    <div class="modal-dialog">
                        <!-- Modal content-->
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close">&times;</button>
                                <h4 class="modal-title">Extension module status</h4>
                            </div>
                            <div class="modal-body" style="padding: 15px 0 15px 0px">
                                <div class="modal-body">
                                    <div>
                                        <h5>Extension module is not connected</h5>
                                    </div>
                                </div>
                                <div class="modal-footer" style="width: 100%">
                                    <!-- <button id="bt_close_app" type="button" class="btn btn-primary" style="width: 50%" data-dismiss="modal">Close</button> -->
                                    <a style="border: 1px solid;  width: 40%" id="bt_close_app2" class="list-group-item btn">Close</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- Install I2C tools -->
                <div class="modal fade" id="i2c_install" role="dialog">
                    <div class="modal-dialog">
                        <!-- Modal content-->
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close">&times;</button>
                                <h4 class="modal-title">Extension module status</h4>
                            </div>
                            <div class="modal-body" style="padding: 15px 0 15px 0px">
                                <div class="modal-body">
                                    <div>
                                        <h5>I2C-tool not installed</h5>
                                    </div>
                                </div>
                                <div class="modal-footer" style="width: 100%">
                                    <!-- <button id="bt_close_app" type="button" class="btn btn-primary" style="width: 50%" data-dismiss="modal">Close</button> -->
                                    <!-- <button id="bt_install_i2c" type="button" class="btn btn-primary" style="width: 50%" data-dismiss="modal">Install</button> -->
                                    <!-- <div class="bazaar-link" style="float: left; width: 50%;">
                                        <a href="#" style="border: 1px solid;  width: 100%" id="bt_install_i2c" data-dismiss="modal" class="list-group-item btn">Install</a>
                                    </div> -->
                                    <div class="bazaar-link" style="float: left; width: 50%;">
                                        <a href="/" style="border: 1px solid;  width: 100%" id="bt_close_app1" data-dismiss="modal" class="list-group-item btn">Close</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
<script language="javascript" type="text/javascript">
    //Set only one measurment parent().find('.checkbox')

    $('#content_wrapper input:checkbox:not(.radio)').on('change', function() {
        var parent = $(this).parent().closest('div').attr('id');
        $('#' + parent).find('input[index=checkbox]').prop('checked', false);
        $(this).prop('checked', true);
    });
</script>
</html>